const path = require('path');
const HtmlWebpackPlugin = require('html-webpack-plugin');
const { CleanWebpackPlugin } = require("clean-webpack-plugin");
const CopyWebpackPlugin = require('copy-webpack-plugin');
const {DefinePlugin} = require('webpack');
module.exports = {
    entry:'./src/js/index.js',
    mode:'development',
    devtool:'source-map',
    output:{
        path:path.resolve(__dirname,'./dist'),
        filename:'js/bundle.js'
    },
    module:{
        rules:[
        {
            test:/\.css$/,
            use:[{
                loader:'style-loader'
            },{
                loader:'css-loader'
            },{
                loader:'postcss-loader'
            }]
        },
        {
            test:/\.less$/,
            use:['style-loader','css-loader','postcss-loader','less-loader']
        },
        {
            test:/\.(png|jpg|jpeg|gif|svg)$/i,
            // type:'asset/resource',
            // type:'asset/inline',
             type:'asset',
            generator:{
                filename:'img/[name].[hash:6][ext]'
            },
            parser:{
                dataUrlCondition:{
                    maxSize:100*1024
                }
            }
        },
        {
            test:/\.(woff2?|eot|ttf)$/i,
             type:'asset/resource',
            generator:{
                filename:'font/[name].[hash:6][ext]'
            },
        }
      ]
    },  
    plugins:[
        new CleanWebpackPlugin(),
        new HtmlWebpackPlugin({
            title:'webpack-02',
            template:'./public/index.html'
        }),
        new DefinePlugin({
            BASE_URL:'"./"'
        }),
        new CopyWebpackPlugin({
            patterns:[{
                from:'public',
                globOptions:{
                ignore:[
                    '**/.DS_Store',
                    '**/index.html'
                ]
               }
            }]
        })
    ]
}